<template lang='pug'>
  section.credit
    van-nav-bar(
      title="我的积分"
      left-arrow
      @click-left="$router.back()"
      )
    .my-credit
      .num {{points}}
      .text 我的积分
    .credit-desc.color-l 成为云商代言人开始计算
    //- .credit-manager
    van-tabbar(v-model="active" :fixed="false")
      van-tabbar-item(icon="question" to="/creditRule") 积分规则
      van-tabbar-item(icon="pending-orders" to="/creditDetail") 积分明细
      van-tabbar-item(icon="gold-coin" to="/withdraw") 积分提现
</template>

<script type='text/ecmascript-6'>
  export default {
    computed: {
      user() { return this.$store.state.authUser || {} },
      points() {
        if (!this.user || !this.user.user) return 0
        return this.user.user.points
      },
    },
    data() {
      return {
        active: -1
      }
    },
    created() {
    },
    methods: {

    }
  }
</script>

<style lang='stylus' rel='stylesheet/stylus'>

@import '~assets/stylus/variable.styl'
 
.credit
  text-align center
  .my-credit
    margin 8rem 0 2rem
    width 20rem
    height 20rem
    display inline-flex
    flex-direction column
    align-items center
    justify-content center
    color $color-main
    border 2px solid
    border-radius 50%
    line-height 1.5
  .num
    font-size 4.5rem
    font-weight 700
  .text
    font-size 1.5rem
  .van-tabbar
    position fixed
    bottom 0
    background-color $color-bg
    &-item
      color $color-main
</style>
